<#assign module="marketing"/>

<@override name="header">
<style>
	/* autocomplete */
	div.ac {border: 1px solid #ccc;position: absolute;display: none;overflow: auto;background-color: #ffffff;z-index:998;}
	div.ac > ul {margin-top:10px;padding:0;}
	div.ac > ul > li {height:33px;line-height:33px;cursor:pointer;}
	div.ac > ul > li:hover{background:#eee;}
	div.ac > ul > li > div span {padding-left:15px;}
	div.ac > ul > li > div span em {color:red;font-style: normal;}
</style>
</@override>
<@override name="body">

	<div class="row">
		<div class="col-md-12">
			<div class="panel panel-default">
				<div class="panel-heading">
					添加客户经理
			    </div>
			    <div class="panel-body">
    				<form id="submit_form" action="${ctx}/weixinmanager/create" class="form-horizontal" method="post">
		              	<input type="hidden" id="longitude" name="longitude" />
		              	<input type="hidden" id="latitude" name="latitude" />
		              	<input type="hidden" id="provName" name="provName" />
		                <input type="hidden" id="cityName" name="cityName" />
		              
		              	<div class="form-group">
		                	<label class="col-sm-3 control-label"><em>*</em>工作单位地址：</label>
	                    	<label style="padding-left:15px;">
							  <select id="prov" class="form-control">
							  </select>
							</label>
	                    	<label style="padding-left:15px;">
							  <select id="city" class="form-control">
							  </select>
							</label>
							<label style="padding-left:15px;">
							  <input class="form-control" id="place" name="place" type="text" style="width:400px;" required/>
							</label>
							<label>
								<i id="addressOk" class="glyphicon glyphicon-ok" style="display:none;"></i>
							</label>
		                </div>
		                
		                <div class="form-group">
		                    <label class="col-sm-3 control-label"><em>*</em>姓名：</label>
		                    <div class="col-sm-3">
		                    	<input class="form-control" id="name" name="name" type="text" required/>
		                    </div>
		                </div>
		                
		                <div class="form-group">
		                    <label class="col-sm-3 control-label"><em>*</em>电话：</label>
		                    <div class="col-sm-3">
		                    	<input class="form-control" id="phone" name="phone" type="text" required/>
		                    </div>
		                </div>
		                
		                <@shiro.isMainCompany>
		                <div class="form-group">
		                    <label class="col-sm-3 control-label"><em>*</em>公司：</label>
		                    <div class="col-sm-3">
	                    		<select class="form-control" id="companyId" name="companyId" required> 
	                    			<option value="">请选择</option> 
	                    			<#list companys as company>
	                    				<option value="${company.id}">${company.abbreviation?if_exists}</option>
	                    			</#list>
	                    		</select>
	                    	</div>
		                </div>
		                </@shiro.isMainCompany>
		                
		                <div class="form-group">
		                    <label class="col-sm-3 control-label"><em>*</em>身份证：</label>
		                    <div class="col-sm-3">
		                    	<input class="form-control" id="idCard" name="idCard" type="text" required/>
		                    </div>
		                </div>
		                
		                <div class="form-group">
		                    <label class="col-sm-3 control-label">微信号：</label>
		                    <div class="col-sm-3">
		                    	<input class="form-control" id="wxAccount" name="wxAccount" type="text"/>
		                    </div>
		                </div>
		                
		                <div class="form-group">
		                    <label class="col-sm-3 control-label"><em>*</em>工作单位名称：</label>
		                    <div class="col-sm-3">
		                    	<input class="form-control" id="placeName" name="placeName" type="text" required/>
		                    </div>
		                </div>
		               
		                <div class="form-group">
		                    <label class="col-sm-3 control-label"><em>*</em>客户经理收费标准：</label>
		                    <div class="col-sm-3">
	                    		<select class="form-control" id="areaId" name="areaId" required> 
	                    			<option value="">请选择</option>
	                    			<#list areas as area>
	                    				<option value="${area.id}">${area.name?if_exists}</option>
	                    			</#list>
	                    		</select>
	                    	</div>
		                </div>
		                
		                <div class="form-group">
		                    <label class="col-sm-3 control-label">个人说明：</label>
		                    <div class="col-sm-6">
		                    	<textarea class="form-control" cols="20" id="personalInfo" name="personalInfo" rows="7" maxlength="255"></textarea>
		                    </div>
		                </div>
		                
		                <div class="form-group">
		                    <label class="col-sm-3 control-label"><em>*</em>提成（固定）：</label>
		                    <div class="col-sm-3">
			                    <div class="input-group">
					            	<input class="form-control" id="fixedMoney" name="fixedMoney" type="number" min="0" required/>
					            	<span class="input-group-addon">元</span>
				                </div>
		                    </div>
		                    <span class="help-block">该固定提成为客户经理所得提成,不使用固定提成请设置为0。</span>
		                </div>
		                
		                <div class="form-group">
		                    <label class="col-sm-3 control-label"><em>*</em>提成（比例）：</label>
		                    <div class="col-sm-3">
		                    	<div class="input-group">
					            	<input class="form-control" id="ratioMoney" name="ratioMoney" type="number" min="0" max="100" required/>
					            	<span class="input-group-addon">%</span>
				                </div>
		                    </div>
		                    <span class="help-block">该提成比例为客户经理所得提成比例,不使用按比例提成请设置为0。</span>
		                </div>
		                
		                
		                <div class="form-group">
		                	<label class="col-sm-3 control-label"><em>*</em>提成类型：</label>
		                	<p class="form-control-static">
		                    	<label style="padding-right:20px;padding-left:15px;">
								  <input type="radio" name="weixinManagerMoneyType" value="guding" checked="checked" />使用固定提成
								</label>
								<label>
								  <input type="radio" name="weixinManagerMoneyType" value="bili"/>使用比例提成
								</label>
							</p>
		                </div>
		                
		                <div class="form-group">
		                    <label class="col-sm-3 control-label"><em>*</em>公司承担比例：</label>
		                    <div class="col-sm-3">
		                    	<div class="input-group">
					            	<input class="form-control" id="feeAllocation" name="feeAllocation" type="number" min="0" max="100" required/>
					            	<span class="input-group-addon">%</span>
				                </div>
		                    </div>
		                    <span class="help-block">该比例提成为公司和司机承担，客户经理所得提成比例。</span>
		                </div>
		                
		                <div class="form-group" style="margin-left:10px;">
			                <label class="col-sm-3 control-label"></label>
			                <input id="submit_button" type="submit" class="btn btn-primary" value="保存">
			                <input type="button" class="btn btn-default" onclick="javascript:history.go(-1);" value="返回">
			            </div>
			            
					</form>
        		</div>
			</div>
		</div>
	</div>

</@override>
<@override name="footer">
<script src="${ctx}/assets/js/jquery.autocomplete.min.js"></script>
<script src="${ctx}/assets/js/jquery.cityselect.js"></script>
<script type="text/javascript">
	function clearForm(){
	    $("#longitude").val("");
	    $("#latitude").val("");
	    $("#place").val("");
	    $("#addressOk").hide();
	}
	
	$(document).ready(function(){

		$.initProv("#prov", "#city");
		//改变地区
		$("#prov").change(function(){
			$("#provName").val($("#prov option:selected").text());
			$("#cityName").val($("#city option:selected").text());
			clearForm();
		});
		$("#city").change(function(){
			$("#provName").val($("#prov option:selected").text());
			$("#cityName").val($("#city option:selected").text());
			clearForm();
		});
		
		
		
		<#if currentProvName??>
			$("#prov option").each(function(index,element){
			  	if($(element).text()=='${currentProvName}'){
			 		$(element).attr("selected","selected");
			 		$(element).change();
			 		return false;
			 	}
			});
		</#if>
		<#if currentCityName??>
			$("#city option").each(function(index,element){
			  	if($(element).text()=='${currentCityName}'){
			 		$(element).attr("selected","selected");
			 		return false;
			 	}
			});
		</#if>
		
		$('#place').AutoComplete({
            'data': "${ctx}/weixinmanager/getAddress",
			ajaxDataType: 'json',
			ajaxParams:function(keyword){
				return {'city':$("#city option:selected").text()};
			},
            'width': 'auto',
            'async': false,
            'listStyle': 'custom',
	        'emphasis': false,
	        'matchHandler': function(keyword, data){
	            return true;
	        },
	        'createItemHandler': function(index, data){
	        	return "<span>"+data.name+"</span>";
	        },
	        'afterSelectedHandler': function(data){
	        	$('#place').val(data.name);
	        	$('#longitude').val(data.lng);
	        	$('#latitude').val(data.lat);
	        	$("#addressOk").show();
	        }
        }).AutoComplete('show');

		
		$("#submit_form").submit(function(){
			
			if($("#longitude").val()=="" || $("#latitude").val()=="" || $("#provName").val()=="" || $("#cityName").val()=="" || $("#place").val()==""){
				$.scojs_message("请选择正确的工作单位地址", $.scojs_message.TYPE_ERROR);
				return false;
			}
			
			if($("#name").val().length>6){
				$.scojs_message("姓名不能超过6个字符", $.scojs_message.TYPE_ERROR);
				return false;
			}
			
			if($("#placeName").val().length>20){
				$.scojs_message("工作单位名称不能超过20个字符", $.scojs_message.TYPE_ERROR);
				return false;
			}
			
			$("#submit_button").attr("disabled",true);
			$.post($("#submit_form").attr("action"),$("#submit_form").serialize(),function(result){
				if(result.success){
					$.scojs_message("添加成功", $.scojs_message.TYPE_OK);
					window.location="${ctx}/weixinmanager/list";
				}
				else{
					$("#submit_button").attr("disabled",false);
					$.scojs_message(result.message, $.scojs_message.TYPE_ERROR);
				}
			});
			
			return false;
	        
		});
	
	});
</script>
</@override>
<@extends name="../layout.ftl"/>